<template>
  <Card title="基本信息">
    <!-- 订单其他信息 -->
    <view class="basic-info">
      <DescriptionsItem :label="item.label" v-for="(item,index) in descriptionList">{{ item.value || '-' }}</DescriptionsItem>
    </view>
  </Card>
</template>
<script>
import DescriptionsItem from "../itemDetail/descriptionsItem.vue";
import Card from "../itemDetail/card.vue";
export default {
  name: "RenewedBasicInfo",
  props: {
    info: {
      type: Object,
      default: () => {
        return {};
      },
    },
  },
  components: {
    Card,
    DescriptionsItem
  },
  computed: {
    // 信息列表
    descriptionList() {
      return [
        { label: '用车人', value: this.info.driverName ? `${this.info.driverName}(${this.info.driverPhone})` : '' },
        { label: '联系人', value: this.info.contactName ? `${this.info.contactName}(${this.info.contactPhone})` : '' },
        { label: '车牌号', value: this.info.licenseNo },
        { label: '品牌车型', value: this.info.modelName },
        { label: '用车城市', value: this.info.cityName },
        { label: '取还车地点', value: this.info.address },
        { label: '供应商', value: this.info.supplierName },
        { label: '取还车门店', value: this.info.storeName ? `${this.info.storeName}(${this.info.storePhone})` : '' },
        { label: '预计开始时间', value: this.info.startTime },
        { label: '预计结束时间', value: this.info.endTime },
        { label: '预计租期', value: this.info.days },
      ]
    }
  },
  methods: {
  },
  created() {
  }
};
</script>
<style lang="less" scoped>
.car-detail-t {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  .car-detail-img {
    width: 200rpx;
    height: 150rpx;
    border-radius: 4rpx;
    background: #f6f7fb;
    overflow: hidden;
    image {
      width: 100%;
    }
  }
  .car-detail-t-r {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    margin-left: 16rpx;
    width: 330rpx;
    white-space: initial;
    view:nth-child(1) {
      color: #212329;
      font-size: 28rpx;
      font-weight: 700;
      white-space: break-spaces;
    }
    .car-detail-t-types {
      margin-top: 4rpx;
      white-space: break-spaces;
      view {
        display: inline-block;
        color: #909399;
        font-size: 24rpx;
        font-weight: 500;
      }
    }
  }
}
.basic-info {
  margin-top: 20rpx;
}
</style>
